22. Exercise: Data Binding in Sunshine

In this exercise, you will get to update the layout for the Details Layout, while at the same time, use data binding to populate the information displayed on it. The goal is to get the Detail Layout look something like this:

To do so, start by enabling Data Binding in build.gradle, then:

  1. Create 2 new layouts, primary_weather_info and extra_weather_detail:
    ..a. primary_weather_info should include the upper part of the design as shown in the image above
    ..b. extra_weather_detail should include the extra details part of the design (Humidity, Pressure, etc)
  2. Replace the old detail layout with a new Linear Layout that will include 2 new layouts above
  3. Update the DetailActivity by replacing all findViewById calls with actual data binding like we did with the toy app.
  4. Finally, for accessibility, make sure you set content description of all the views in the new details activity.

Exercise: Data Binding in Sunshine

Now it's your turn, follow the TODOs in the comments and check the steps below when you're done!

Exercise Code

Exercise: S11.03-Exercise-DetailLayoutAndDataBinding
SOLUTION:
  • Create the 2 layouts, primary_weather_info and extra_weather_detail
  • Replace the old Detail Layout with a new Linear Layout that will include 2 new layouts above
  • Update the DetailActivity by replacing all findViewById calls with actual data bindings
  • Set content description values of all the appropriate views in the new details activity

Next Concept